<template>
  <div class="app-container">
    <List ref="list"
          @add-handle="addHandle"
          @update-handle="updateHandle"
          @detail-handle="detailHandle"></List>
    <!-- 添加或修改行政区划对话框 -->
    <el-dialog :close-on-click-modal="false" :close-on-press-escape="false"
               :title="title"
               :visible.sync="open"
               fullscreen
               append-to-body
               destroy-on-close
    >

      <Add v-if="type === ADD && open" @cancel="cancelHandle" @reload="reloadHandle"  ></Add>
      <Edit v-if="type === UPDATE && open" @cancel="cancelHandle" @reload="reloadHandle" :id="id"></Edit>
      <DForm v-if="type === UPDATE_JSON && open" @cancel="cancelHandle" :id="id"></DForm>
      <ShowJson v-if="type === SHOW_JSON && open" @cancel="cancelHandle" :id="id"></ShowJson>
    </el-dialog>
  </div>
</template>

<script>
import IndexMixin from "@/minixs/basic/index"

import List from "./list.vue"
import Add from "./add.vue"
import Edit from "./edit.vue"
import Detail from "./edit.vue"
import ShowJson from "./showJson.vue";
import DForm from "./form/index.vue"
export default {
  name: "Form",
  mixins: [IndexMixin],
  data(){
    return {
      UPDATE_JSON:"UPDATE_JSON",
      SHOW_JSON:"SHOW_JSON",
    }
  },
  components: {
    List,
    Add,
    Edit,
    Detail,
    DForm,
    ShowJson
  }
};
</script>
